<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>火云鞋神官方旗舰店</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/product.css">
    <!--<link rel="stylesheet" href="../layui/css/layui.css" media="all">-->
</head>
<body>
<div class="container-fluid" style="background-color: #F2F2F2">
    <!--<div class="row a">
        <div class="col-md-2"></div>
        <div class="col-md-1"><img src="../img/logo.png"></div>
        <div class="col-md-1"></div>
        <div class="col-md-1"></div>
        <div class="col-md-1"></div>
        <div class="col-md-1"></div>
        <div class="col-md-3" style="margin-top: 30px">
            <div class="top-header">
                <ul><span class="phone">090 - 223 44 66</span></ul>
                <ul><span class="glyphicon glyphicon-envelope"><a href="">  help@trendd.com</a></span></ul>
            </div>
            <div style="clear: both"></div>
            <div class="top-middle">
                <div>
                    <ul><a href="" style="border-right:3px white solid;padding-right: 20px"><img src="../img/shop2.svg"
                                                                                                 alt=""
                                                                                                 style="width: 30px;margin-top: 0px;"></a>
                    </ul>
                </div>
                <div>
                    <ul style="padding-left: 15px;margin-top: 2px"><a href="" style="color: #9B0909;font-weight:bold;">LOGIN</a>
                    </ul>
                </div>
                <div>
                    <bottom type="button" class="btn btn-danger">REGISTER</bottom>
                </div>
            </div>
        </div>
        <div class="col-md-2"></div>
    </div>
    <div class="row b">
        <div class="col-md-2"></div>
        <div class="b-user col-md-8 ">
            <ul><h4><a href="">PRODUCTS </a></h4></ul>
            <ul><h4><a href="">CAMPAINGS</a></h4></ul>
            <ul><h4><a href="">SERVICES</a></h4></ul>
            <ul><h4><a href="">BRANDS</a></h4></ul>
            <ul><h4><a href="">BRANDS</a></h4></ul>
            <ul><input type="text" class="form-control" placeholder="Search" style="border-radius: 20px;">
                <a href=""><img src="../img/search.svg" alt="" style="margin-left: 170px;margin-top: -54px"></a></ul>
        </div>
    </div>-->
    <iframe   src="../html/head.html"  width="100%" height="260px" scrolling="no"     name="iframe1"   style="border: 0" >
    </iframe>
    <iframe   src="../html/middle.html" width="100%" height="360px"  scrolling="no"   name="iframe2"   style="border: 0" >
    </iframe>
    <iframe  src="../html/shoe.html" width="100%" height="1200px"     name="iframe3"   style="border: 0" >
    </iframe>
    <!--<div class="row c">
        <div class="col-md-2"></div>
        <div class="col-md-1 c-filted">
            <a href="" style="color: white"><h4>FILTER</h4></a>
        </div>
        <div class="col-md-7"></div>
        <div class="col-md-2"></div>
    </div>
    <div class="row d">
        <div class="col-md-2"></div>
        <div class="col-md-8 d-photo">
            <div class="row">
                <div class="col-md-3">
                    <h3 style="font-weight: bolder">BRANDS</h3>
                    <ul class="d-ul list-unstyled" style="border-right:1px solid #5cb85c ;height: 200px">
                        <li><a href="">new</a></li>
                        <li><a href="">add</a></li>
                        <li><a href="">balance</a></li>
                        <li><a href="">puma</a></li>
                    </ul>
                    <ul class="d-ul list-unstyled">
                        <li><a href="">tiger</a></li>
                        <li><a href="">cat</a></li>
                        <li><a href="">docat</a></li>
                        <li><a href="">nibi</a></li>
                    </ul>
                </div>
                <div class="col-md-6 ">
                    <div class="row">
                        <div class="d-shoe col-md-4">
                            <div>
                                <h2>WOMAN</h2>
                                <a href=""><img class="d-img"
                                                src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/img-w.jpg" alt=""></a>
                                <h4>TOTAL</h4>
                                <label>357 PRODUCTS</label>
                                <p><a href=""><img src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/list-icon.png"
                                                   alt="" style="width: 16px"></a></p>
                            </div>
                        </div>
                        <div class="d-shoe col-md-4">
                            <div>
                                <h2>MAN</h2>

                                <a href=""><img class="d-img"
                                                src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/man-r-img.jpg" alt=""></a>
                                <h4>TOTAL</h4>
                                <label>357 PRODUCTS</label>
                                <p><a href=""><img src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/list-icon.png"
                                                   alt="" style="width: 16px"></a></p>
                            </div>
                        </div>
                        <div class="d-shoe col-md-4">
                            <div>
                                <h2>KIDS</h2>
                                <a href=""><img class="d-img"
                                                src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/kid-r-img.jpg" alt=""></a>
                                <h4>TOTAL</h4>
                                <label>357 PRODUCTS</label>
                                <p><a href=""><img src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/list-icon.png"
                                                   alt="" style="width: 16px"></a></p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <img class="d-img" src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2996810576,291798969&fm=26&gp=0.jpg" style="padding-top: 20px" alt="">
                </div>
            </div>
        </div>
        <div class="col-md-2"></div>
    </div>-->
   <!-- <div class="row e">
        <div class="col-md-2"></div>
        <div class="col-md-8" style="background-color: white;">
            <div>
                <div class="e-top1">
                    <h3>SPECIAL <span style="color: red">PRODUCTS</span></h3>
                </div>
                <div class="e-top2">
                    ▶<a href=""> view all products</a>
                </div>
            </div>
            <div style="clear: both"></div>
            <div class="row e-shopping" id="aa">
                    &lt;!&ndash;<div >
                        <a href=""><img src="http://demo2.cssmoban.com/cssthemes2/ftmp8_52_hb/images/p1.jpg" alt=""></a>
                        <h4><a href="">Nike Roshe Run</a></h4>
                        <a href="" class="e-a">
                            <span>109.90$  </span>
                            <small>GET NOW</small>
                            <label>></label>
                        </a>
                    </div>&ndash;&gt;
            </div>
            <nav style="text-align: right">
                <ul class="pagination" id="ul" style="margin: 0 auto;">

                </ul>
            </nav>
        </div>
        <div class="col-md-2"></div>
    </div>-->

</div>
<iframe  src="../html/foot2.html" width="100%" scrolling="no" height="356px"     name="iframe3"   style="border: 0" >
</iframe>
<script src="../js/jquery-3.3.1.min.js"></script>
<script src="../js/bootstrap.min.js"> </script>
<script>



//    function f1() {
//
//        if(a != null){
//            window.location.href ="http://localhost:63343/qiguai/html/userperson.html"
//        }else {
//            alert("未登录，请登录！！！！")
//            window.location.href ="http://localhost:63343/qiguai/html/login.html"
//        }
//    }

/*$("body").on("click","#personal",function () {
    if(a != null){
        window.location.href ="http://localhost:63343/qiguai/html/userperson.html"
        // localStorage.setItem("anchor",a);
    }else {
        alert("未登录，请登录！！！！")
        window.location.href ="http://localhost:63343/qiguai/html/login.html"
        // localStorage.setItem("anchor","");
    }
})*/

    // if(localStorage.getItem("anchor")!==""){
    //     location.href = "http://localhost:63343/qiguai/html/userperson.html"
    // }
    /*/!*var currPage = 1;
    // 每页默认12条数据
    var pageSize = 12
    // 获取传递的参数  /showhero.html?currPage=2--?currPage=2
    var search = location.search
    console.log(search)
    // 按照=对参数分割
    var arr = search.split("=")
    // 第一次访问页面时，是没有传递参数的，只有在分页时才会传递参数
    // 防止第一次出现问题
    /!*console.log(arr.length)*!/
    if(arr.length >1){
        currPage = arr[1]
    }
    var  c
    console.log(currPage)
    var b = currPage.split("&")
    if(b.length >1){
        c = b[0]
    }
    console.log(c)
    /!*if(currPage <10){
        c = currPage.substring(0,1)
    }else {
        c = currPage.substring(0,2)
    }*!/
    console.log(c)

    var d;
    if(c>0 && c<100 ){
        d =c;
    }else {
        d=1;
    }*!/

    pageSize=12;
    var search = location.search;
    console.log(search)
    // 按照=对参数分割
    var arr = search.split("=")
    if(arr.length >1){
        currPage = arr[1]
    }
    console.log(currPage)

    var k;
    var j= currPage.split("&")
    if(j.length >1){
        k = j[0]
    }
    var l=1;

    if(k>0 && k<100){
        l=k;
    }

    console.log(l)

    GetChildValue("","","",l)

    function GetChildValue(a,b,c,d){
        console.log(d)

        $.getJSON("http://localhost:8080/nb/shoe?currPage="+ d + "&pageSize=" + pageSize + "&goodBrand=" + c + "&goodSex=" + "&goodUpper=" + a + "&goodScience=" + b,function (data) {
            console.log(data)
            var list = data.data.list
            f(list)
            generatePage(data.data.navigatepageNums,  data.data.pageNum
                , data.data.pages)
        });

        function generatePage(navigatepageNums, pageNum, pages){
            console.log(navigatepageNums)
            console.log(pageNum)
            console.log(pages)
            var html = ''
            console.log(pageNum == 1)
            if(pageNum == 1){
                html += `<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>`
            } else {
                html += `<li><a href="http://localhost:63343/qiguai/html/product.html?currPage=${pageNum-1}&pageSize=12&goodBrand=${c}&goodSex=&goodUpper=${a}&goodScience=${b}" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>`
            }
            // console.log(navigatePages)
            // 生成页码
            for(let i = 0; i < navigatepageNums.length; i++){
                if(pageNum == navigatepageNums[i]){
                    // 当前页class=active，设置选中效果
                    html += `<li class="active"><a href="#">${navigatepageNums[i]}</a></li>`
                } else {
                    // showhero.html?
                    // 不是当前页
                    html += `<li><a href="http://localhost:63343/qiguai/html/product.html?currPage=${navigatepageNums[i]}&pageSize=12&goodBrand=${c}&goodSex=&goodUpper=${a}&goodScience=${b}">${navigatepageNums[i]}</a></li>`
                }
            }

            if(pageNum == pages) {
                html += `<li class="disabled"><a href="#" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a></li>`
            } else {
                html += `<li><a href="http://localhost:63343/qiguai/html/product.html?currPage=${pageNum+1}&pageSize=12&goodBrand=${c}&goodSex=&goodUpper=${a}&goodScience=${b}" onclick="" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a></li>`
            }

            $("#ul").html(html)

        }






    }

        /!*$.getJSON("http://localhost:8080/nb/nbdaa?currPage="+ d + "&pageSize=" + pageSize ,function (data) {
            console.log(data)
            var list = data.data.list
            f(list)
            generatePage(data.data.navigatepageNums,  data.data.pageNum
                , data.data.pages)
    });*!/



        function f(list) {
            let html = ''
            for(let i = 0; i < list.length; i++) {
                console.log(list[i])
                html += `
            <div class="col-md-3" >
            <div style="float: left">
            <a href="http://localhost:63343/qiguai/html/single-goods.html?id=${list[i].goodId}"><img src="${list[i].goodPhoto}" alt=""></a>
            <h4 ><a href="http://localhost:63343/qiguai/html/single-goods.html?id=${list[i].goodId}" style="width: 200px;text-overflow:ellipsis;overflow: hidden;white-space: nowrap;display: -webkit-box;display:block">${list[i].goodName}</a></h4>
            <a href="http://localhost:63343/qiguai/html/single-goods.html?id=${list[i].goodId}" class="d-a">
            <span>${list[i].goodMoney}$  </span>
            <small>GET NOW</small>
            <label>></label>
            </a>
            </div>
            </div>
            `
            }
            $("#aa").html(html)
        }


*/

/*    var a = document.getElementById("aby").value;
    console.log(a)

console.log("1111")*/

   /* function GetChildValue(a,b,c){
        console.log(a)
        console.log(b)
        console.log(c)
    }*/

</script>
</body>
</html>